<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
<form>
    <input type="file" name="upfile">
    <br>
    <input type="text" name="num">
    <br>
    <button>提交</button>
</form>

<script>

let form = document.querySelector('form');
// 当点击表单内的按钮时，会触发form元素的submit事件
form.onsubmit = function (event){
    // 阻止表单提交（阻止表单的默认行为）
    event.preventDefault();

    let xhr = new XMLHttpRequest();
    xhr.open('post','http://localhost:9090/goods/upload');

    // xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    // xhr.send('a=123&b=456');

    // FormData表单数据(用于收集表单数据)
    let fd = new FormData(form);
    // console.log( fd );// FormData {}
    // 发送FormData数据时，自动设置请求头内容类型为multipart/form-data
    // xhr.setRequestHeader('Content-Type','multipart/form-data');
    xhr.send(fd);

    xhr.onload = function (){
        console.log( xhr.responseText );
    }
}

</script>
</body>
</html>